﻿<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
    <!--作为公共模版分离出去-->
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="Bookmark" href="admin/images/rookieCs.ico" />
    <link rel="Shortcut Icon" href="admin/images/rookieCs.ico" />
    <link rel="stylesheet" type="text/css" href="admin/static/h-ui/css/H-ui.my.css" />
    <link rel="stylesheet" type="text/css" href="admin/static/h-ui.admin.pro.iframe/css/h-ui.admin.pro.iframe.min.css" />
    <link rel="stylesheet" type="text/css" href="admin/lib/Hui-iconfont/1.0.9/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="admin/static/h-ui.admin.pro.iframe/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="admin/lib/jquery-easyui/1.7.0/themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="admin/lib/jquery-easyui/1.7.0/themes/icon.css" />
    <link rel="stylesheet" type="text/css" href="admin/lib/lc_switch/20160127/css/lc_switch.css" />
    <link rel="stylesheet" type="text/css" href="admin/css/iconfont/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="admin/css/mywork.css" />
    <script type="text/javascript" src="admin/lib/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript" src="admin/lib/layer/3.1.1/layer.js"></script>
    <script type="text/javascript" src="admin/lib/jquery-easyui/1.7.0/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="admin/lib/jquery-easyui/1.7.0/plugins/datagrid-detailview.js"></script>
    <script type="text/javascript" src="admin/lib/jquery-easyui/1.7.0/locale/easyui-lang-zh_CN.js"></script>
    <script type="text/javascript" src="admin/lib/lc_switch/20160127/js/lc_switch.min.js"></script>
    <script>document.write('<script type="text/javascript" src="admin/js/common.js?v='+ Date.now() +'"><\/script>');</script>
    <script>document.write('<script type="text/javascript" src="admin/js/formatter.js?v='+ Date.now() +'"><\/script>');</script>
    <!--作为公共模版分离出去-->
    <title>岗位列表</title>
</head>
<body class="easyui-layout" style="width: 100%; height: 100%;font-family: 微软雅黑,serif" menuId="role-list">
<nav class="breadcrumb">
    <i class="Hui-iconfont">&#xe67f;</i> 首页
    <span class="c-gray en" style="float: none">&gt;</span> 管理员管理
    <span class="c-gray en" style="float: none">&gt;</span> 岗位管理
    <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a>
</nav>
<!--查询条件元素-->
<div id="searchInfo" style="padding: 2px 0 2px 5px; background-color: #F5FAFE;">
</div>
<!--按钮元素-->
<div id="buttonInfo" style="padding: 2px 0 2px 5px; background-color: #F5FAFE;">
    <button class="easyui-linkbutton" onclick="addRole()"><i class="Hui-iconfont">&#xe600;</i>新增</button>
    <button class="easyui-linkbutton" onclick="editRole()"><i class="Hui-iconfont">&#xe6df;</i>修改</button>
    <button class="easyui-linkbutton" onclick="delRole()"><i class="Hui-iconfont">&#xe6e2;</i>删除</button>
</div>
<!--表格元素-->
<div id="tableInfo"></div>
<script type="text/javascript">
    //准备函数
    $(function () {
        initSearchForm();
        initGrid();
        getGridHidden("tableInfo");
        query(pageParam);
    });

    //查询条件初始化
    function initSearchForm() {
    }

    //表格元素初始化
    function initGrid() {
        $("#tableInfo").datagrid({
            pagination: false,
            singleSelect: true,
            fitColumns: true,
            striped: true,
            fit: true,
            columns: [[
                {field: "ck", checkbox: "true"},
                {field: "department", title: "所属部门", width: 100, align: "center", formatter: roleDepartmentFormatter},
                {field: "name", title: "岗位名称", width: 200, align: "center"},
                {field: "userName", title: "员工名称", width: 800, align: "center"},
                {field: "remark", title: "描述", width: 150, align: "center"},
                {field: "oper", title: "操作", width: 80, align: "center",
                    formatter: function (value, row) {
                        return '<a style="text-decoration:none" onClick="setRoleMenu(\''+ row.id + '\')" title="设置权限"><i class="Hui-iconfont">&#xe61d;</i></a>';
                    }
                }
            ]],
            //表格工具栏元素ID
            toolbar: ".breadcrumb, #searchInfo, #buttonInfo",
            onSelect: function (rowIndex, rowData) {
                selectedTableRow();
            },
            onUnselect: function (rowIndex, rowData) {
                selectedTableRow();
            },
            onSelectAll: function (rowIndex, rowData) {
                selectedTableRow();
            },
            onUnselectAll: function (rowIndex, rowData) {
                selectedTableRow();
            },
            onLoadSuccess: function (data) {
                toolBarBtnDisabledById([false, true, true], "buttonInfo");
            }
        });
        //表格事件
        var selectedTableRow = function() {
            var selectRow = $("#tableInfo").datagrid("getSelections");
            if (selectRow.length === 0) {
                toolBarBtnDisabledById([false, true, true], "buttonInfo");
            } else if (selectRow.length === 1) {
                toolBarBtnDisabledById([false, false, false], "buttonInfo");
            } else {
                toolBarBtnDisabledById([false, true, false], "buttonInfo");
            }
        };
    }

    //获取用户个性化设置
    function getGridHidden() {
        ajaxGetFun("userMenuHidden/getUserMenuHidden", {menuId: $("body").attr("menuId"), gridId: "tableInfo"}, function(bizData) {
            for (var i in bizData) {
                $("#tableInfo").datagrid("hideColumn", bizData[i].gridCol);
            }
        }, null, "获取用户个性化设置");
    }

    //查询
    function query(pageParam) {
        ajaxGetFun("role/getRoleList", pageParam, function (bizData) {
            $("#tableInfo").datagrid("loadData", bizData);
            var department = bizData[0].department;
            var index = 0;
            var rowspan = 0;
            for (var i in bizData) {
                if (department === bizData[i].department) {
                    rowspan ++;
                } else {
                    //合并单元格
                    $("#tableInfo").datagrid('mergeCells', {index: index, field: "department", rowspan: rowspan});
                    department = bizData[i].department;
                    index = i;
                    rowspan = 1;
                }
                if (i == bizData.length-1) {
                    $("#tableInfo").datagrid('mergeCells', {index: index, field: "department", rowspan: rowspan});
                }
            }
        }, null, "获取岗位列表");
    }

    //新增
    function addRole() {
        var openedFun = function () {};
        var saveFun = function(index, layero) {
            var formEle = layero.find("iframe")[0].contentWindow.$("#formInfo");
            if (formEle.form("validate")) {
                var roleInfo = getFormJson(formEle);
                var successFun = function(bizData) {
                    layer.close(index);
                    query(pageParam);
                    showSuccessMsg("新增成功");
                };
                ajaxPostFun("role/saveInfo", roleInfo, successFun, null, "新建岗位");
            }
        };
        openIframe(false, 500, 260, "role-info.html", openedFun, saveFun);
    }

    //修改
    function editRole() {
        var selectRows = $("#tableInfo").datagrid("getSelections");
        if (selectRows.length != 1) {
            return showWarnMsg("请选择一条条目后操作");
        }
        var openedFun = function (index, layero) {
            $("iframe")[0].contentWindow.$("#formInfo").form("load", selectRows[0])
        };
        var saveFun = function(index, layero) {
            var formEle = layero.find("iframe")[0].contentWindow.$("#formInfo");
            if (formEle.form("validate")) {
                var roleInfo = getFormJson(formEle);
                var successFun = function(bizData) {
                    layer.close(index);
                    query(pageParam);
                    showSuccessMsg("修改成功");
                };
                ajaxPostFun("role/updateInfo", roleInfo, successFun, null, "修改岗位");
            }
        };
        openIframe(false, 500, 260, "role-info.html", openedFun, saveFun);
    }

    //删除
    function delRole() {
        var selectRows = $("#tableInfo").datagrid("getSelections");
        if (selectRows.length == 0) {
            return showWarnMsg("请选择条目后操作");
        }
        var ids = mergedRowCell(selectRows, "id");
        layer.confirm("确认要删除选中的岗位吗？", function(index) {
            var successFun = function(bizData) {
                showSuccessMsg("已删除"+ bizData +"条数据");
                query(pageParam);
            };
            ajaxPostFun("role/deleteInfoByIds", {ids: ids}, successFun, null, "删除岗位");
        });
    }

    //设置权限
    function setRoleMenu(roleId) {
        ajaxGetFun("role/getMenuListByRoleId", {roleId: roleId}, function (bizData) {
            var html = '<form id="formInfo"><table class="formTable">';
            var count = 0;
            for (var i=0; i<bizData.length; i++) {
                html +=
                    '<tr>' +
                    '   <td style="width: 150px; text-align: right">'+ bizData[i].name +'：</td>' +
                    '   <td style="width: 100px"><input type="checkbox" name="tableColSwitch" value="'+ bizData[i].id +'" class="lcs_check"'+ (bizData[i].roleMenu ? ' checked="checked"' : '') +' /></td>' +
                    '   <td style="width: 50px;"></td>' +
                    '</tr>';
                count++;
                for (var j=0; j<bizData[i].children.length; j++) {
                    html +=
                        '<tr>' +
                        '   <td style="width: 50px;"></td>' +
                        '   <td style="width: 150px; text-align: right">'+ bizData[i].children[j].name +'：</td>' +
                        '   <td style="width: 100px"><input type="checkbox" name="tableColSwitch" value="'+ bizData[i].children[j].id +'" class="lcs_check"'+ (bizData[i].children[j].roleMenu ? ' checked="checked"' : '') +' /></td>' +
                        '</tr>';
                    count++;
                }
            }
            html +=  '</table></form>';
            var height = 65 + count*35;
            openHtml(false, 500, height, html, function () {
                $("input[name='tableColSwitch']").lc_switch();
            }, function(index, layero) {
                var menuIds = "";
                $.each($("input[name='tableColSwitch']:checkbox"),function() {
                    if ($(this)[0].checked) {
                        menuIds += ($(this).val() + ",");
                    }
                });
                if (menuIds !== "") {
                    menuIds = menuIds.substr(0, menuIds.length-1);
                }
                ajaxPostFun("role/saveRoleMenu", {roleId: roleId, menuIds: menuIds}, function(bizData) {
                    showSuccessMsg("保存成功");
                }, null, "保存岗位对菜单");
                layer.close(index);
            });
        }, null, "获取菜单列表")
    }
</script> 
</body>
</html>